import { renderIcon } from '@/store/useNaive'
import { createI18n, useI18n } from 'vue-i18n'
import zhCN from './locales/zh-CN.json'
import enUS from './locales/en-US.json'
import { DropdownOption } from 'naive-ui'
import { CheckmarkSharp } from '@vicons/ionicons5'

const i18n = createI18n({
	legacy: false,
	locale: 'zhCN' as UserSettings['locale'],
	messages: {
		zhCN,
		enUS
	}
})

export default i18n

/** naive 的下拉列表 */
export const useLocaleOptions = () => {
	const { locale } = useI18n()
	const localeOptions: DropdownOption[] = [
		{ label: '简体中文', key: 'zhCN' },
		{ label: 'English', key: 'enUS' }
	]
	return computed(() =>
		localeOptions.map(item => (item.key === locale.value ? { ...item, icon: renderIcon(CheckmarkSharp) } : item))
	)
}
